<template>
<div class="container">
    <div>
        <img :src="ResultPIC1" alt />
    </div>
    <div class="result-box">
        <div class="result-top">
            <div>
                <span class="result-title lettle-space">标题：</span>
                <span class="result-msg">{{list.title}}</span>
            </div>
            <div>
                <span class="result-title">举报时间:</span>
                <span class="result-msg">{{list.createdTime}}</span>
            </div>
            <div>
                <span class="result-title">举报方式:</span>
                <span class="result-msg" v-if="list.type==1">匿名举报</span>
                <span class="result-msg" v-else-if="list.type==2">实名举报</span>
                <span class="result-msg" v-else></span>
            </div>
            <div>
                <span class="result-title">处理状态:</span>
                <span class="result-msg color-red" v-if="list.status=='2'">已驳回</span>
                <span class="result-msg color-blue" v-else-if="list.status==='0'">待处理</span>
                <span class="result-msg color-blue" v-else-if="list.status=='1'">已受理</span>
                <span class="result-msg color-blue" v-else-if="list.status=='3'">立案调查</span>
                <span class="result-msg" v-else-if="list.status==''"></span>
            </div>
        </div>
        <div class="result-body">
            <div>
                <h1 class="result-detail">状态详情</h1>
                <div v-if="list.approvedTime!==null">
                    <span class="result-title">受理时间:</span>
                    <span class="result-msg">{{list.approvedTime}}</span>
                </div>
                <div v-if="list.surveyedTime!==null">
                    <span class="result-title width-100">开启立案调查时间:</span>
                    <span class="result-msg">{{list.surveyedTime}}</span>
                </div>
                <span class="result-title" v-if="list.status=='2'">驳回理由:</span>
                <span class="result-msg">{{list.opinion}}</span>
            </div>
        </div>
        <div class="result-bt" to="/LawsAndRegulations" @click="gototo">确定</div>
    </div>
</div>
</template>

<script>
import Pending from "@/components/ReportInvestigation/Pending.vue";
import Processed from "@/components/ReportInvestigation/Processed.vue";
import MoreTime from "@/components/ReportInvestigation/MoreTime.vue";
export default {
    components: {
        Pending,
        Processed,
        MoreTime,
    },
    data() {
        return {
            ResultPIC1: require("@/assets/image/result-1.png"),
            choice: "MoreTime",
            list: {
                title: "",
                type: "",
                createdTime: "",
                status: "",
                approvedTime: null,
                surveyedTime: null,
                opinion: "",
            },
        };
    },
    methods: {
        //     data:
        // approvedTime: null
        // createdTime: "2020-08-15 18:15:08"
        // opinion: "您好，感谢您的举报，我们会尽快处理。"
        // status: "0"
        // surveyedTime: null
        // title: "1"
        // type: "1"
        gototo() {
            this.$router.push({
                name: "Query"
            });

        },
        get() {
            // let captcha = sessionStorage.getItem("captcha");
            // let code = sessionStorage.getItem("code");
            // console.log(captcha, code);
            // this.Api.getQueryDetail({
            //   captcha: captcha,
            //   code: code,
            // }).then((res) => {
            //   console.log(res, "查询详情");
            //   if (res.code === "0") {
            //     // let all = JSON.stringify( res.data )
            //     // sessionStorage.setItem("queryresult",all)
            //     // let newsty=sessionStorage.getItem("queryresult")
            //     // let newall= JSON.parse( newsty );
            //     this.list = {
            //       title:res.data.title,
            //       type: res.data.type,
            //       createdTime: res.data.createdTime,
            //       status: res.data.status,
            //       approvedTime:res.data.approvedTime,
            //       surveyedTime: res.data.surveyedTime,
            //       opinion: res.data.opinion,
            //     };
            //     // this.list={}
            //     // this.list=newall

            //   } else {
            //     this.$message.error("请重新查询");
            //   }
            // });
            let str = sessionStorage.getItem("captchadetail");
            // console.log(str,"str")
            let arr = JSON.parse(str);
            // console.log(arr,"arr")
            this.list = arr
            // console.log(this.list,"this.list")
        },
    },
    created() {
        this.get();
    },
};
</script>

<style lang="less" scoped>
.container {
    padding: 54px 40px;
}

span {
    display: inline-block !important;
}

.result-box {
    margin-top: 49px;
    min-height: 726px;
}

.result-top {
    margin-bottom: 46px;
}

.result-title {
    width: 80px;
    height: 22px;
    font-size: 16px;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.85);
    padding: 9px 0;
    margin-right: 19px;
}

.result-msg {
    height: 22px;
    font-size: 16px;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.65);
    padding: 9px 0;
}

.width-1000 {
    width: 100%;
}

.color-blue {
    color: rgba(20, 123, 253, 1);
}

.result-detail {
    width: 72px;
    height: 24px;
    font-size: 18px;
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 500;
    color: rgba(0, 0, 0, 0.85);
    padding: 9px 0;
}

.result-bt {
    width: 172px;
    height: 52px;
    background: rgba(20, 123, 253, 1);
    box-shadow: 0px 4px 12px 0px rgba(20, 123, 253, 0.6);
    border-radius: 5px;
    color: rgba(255, 255, 255, 1);
    font-size: 20px;
    margin: 37px 0 0 0;
    outline: none;
    text-align: center;
    line-height: 50px;
    cursor: pointer;
}

.lettle-space::first-letter {
    letter-spacing: 29px;
}

.color-red {
    color: rgba(255, 0, 0, 1);
}

.width-100 {
    width: 144px;
}

.color-red {
    color: rgba(255, 0, 0, 1);
}
</style>
